﻿<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8" isELIgnored="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link href="${pageContext.request.contextPath}/css/reset.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/css/iconfont.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/css/index.css" rel="stylesheet" />
    <script src="${pageContext.request.contextPath}/js/jquery-1.9.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/f.js"></script>
    <title>产品管理</title>
    <script>
        function saveProduct(){
            if ($("#productName").val()==null||$("#productName").val()=='') {
                return false;
            }
            if ($("#discribe").val()==null||$("#discribe").val()=='') {
                return false;
            }
            if ($("#price").val()==null||$("#price").val()=='') {
                return false;
            }
            if ($("#brand").val()==null||$("#brand").val()=='') {
                return false;
            }
            if ($("#type").val()==null||$("#type").val()=='') {
                return false;
            }
            $("#fm").submit();
        }
        function modifyProduct(id,image,productName,discribe,price,brand,type){

            $("#myModalLabel").html("修改产品");
            $("#id").val(id);
            $("#image").val(image);
            $("#productName").val(productName);
            $("#discribe").val(discribe);
            $("#price").val(price);
            $("#brand").val(brand);
            $("#type").val(type);
            $("#butid").html("修改");
        }
        function productDelete(id){
            if(confirm("确定要删除这条数据吗?")){
                $.post("${pageContext.request.contextPath}/ProductServlet.action",{id:id,flag:'deleteById'},
                    function(data){
                        if(data=="true"){
                            alert("删除成功！");
                            window.location.reload(true);
                        }else{
                            alert(result.error);
                        }
                    },
                    'text'
                );
            }
        }
        function mysubmit(){
            $("#fid").submit();
        }

        function mySelect(obj){
            //全选或全不选
            $(":checkbox").prop("checked",obj.checked);
        }

        function deletes() {
            var length = $(".inputcheck:not(:first):checked").length;
            if(length==0){
                alert("请选择要删除的数据！");
                return;
            }
            var strIds=[];
            for(var i=0;i<length;i++){
                strIds.push($(".inputcheck:not(:first):checked").get(i).value);
            }
            var ids=strIds.join(",");
            alert(ids)
            if(confirm("您确定要删除这"+length+"条数据吗？")){
                $.post("ProductServlet.action",{ids:ids,flag:'deletes'},function(data){
                    if(data=='true'){
                        alert("数据已成功删除！");
                        location.reload(true);
                    }else{
                        alert("数据删除失败！");
                    }
                },"text");
            }else{
                return;
            }
        }
    </script>
</head>
<body>
    <div class="PublicHead clearfix">
        <div class="leftBox clearfix">
            <div class="companyLogo">
                <img src="images/logo.jpg" />
            </div>
            <!--<i class="iconfont icon-caidan"></i>-->

            <div class="companyText">
                上海央谷管理系统
            </div>
        </div>
        <div class="RightBox clearfix">
            <div class="UserPhotoBox">
                <div class="UserPic">
                    <img src="images/user.jpg" />
                </div>
                <div class="UserName">
                    管理员
                </div>
            </div>
            <a href="index.jsp">
                <div class="dropOutBox">
                    <i class="iconfont icon-app_icons--">
                    </i>
                    <span>退出</span>
                </div>
            </a>
        </div>
    </div>

    <div class="PublicDownWhole clearfix">
        <!--左侧-->
        <jsp:include page="top.jsp"></jsp:include>
        <!--右侧-->
        <div class="RightBox">
            <div class="PublicContentBox">
                <!--公用指向页面名字-->
                <div class="PublicPointToAgeText">
                    <span class="span1">产品管理  </span> <span class="span2">后台管理产品列表</span>
                </div>
                <!--查询-->
                <form id="fid" action="${pageContext.request.contextPath}/ProductServlet.action?flag=findProduct" method="post">
                <div class="InquireBox clearfix">
                    <div class="InquireleftBox">
                        <div class="Text">产品名称：</div>
                        <div class="InputDiv">   <input name="productName" class="phoneInput" placeholder="请输入你需要查询的订单号" value="${productName}" /></div>
                    </div>
                    <div class="PublicBtnIcon Color1Btn fr">
                        <i class="iconfont icon-icon-chaxun"></i>
                        <span onclick="mysubmit()">查询</span>
                    </div>
                </div>
                </form>
                <!--表修改-->
                <div class="InquireTableBox">
                    <div class="headbox">
                        <div class="headboxtext">
                            <span class="span1">后台管理产品列表</span>
                        </div>
                        <!--批量删除-->
                        <div class="PublicBtnIcon Color5Btn" onclick="deletes()">
                            <i class="iconfont  icon-shanchu"></i>
                            <span>批量删除</span>
                        </div>

                        <div class="PublicBtnIcon Color2Btn fr Js_edit">
                            <i class="iconfont icon-changyongtubiao-mianxing-"></i>
                            <span>添加</span>
                        </div>
                    </div>

                    <!--查询到的表格-->

                    <div class="InquireSelectTable">
                        <table id="list" class="PublicTableCss">
                            <thead>
                                <tr>
                                    <td>
                                        <input id="inputcheck" class="inputcheck" type="checkbox" name="inputcheck" onclick="mySelect(this)"/>
                                        <label for="inputcheck"></label>
                                        <span >全选</span>
                                    </td>
                                    <td>ID</td>
                                    <td>产品图片</td>
                                    <td>产品名称</td>
                                    <td>产品描述</td>
                                    <td>产品价格</td>
                                    <td>产品品牌</td>
                                    <td>产品型号</td>
                                    <td>操作</td>
                                </tr>

                            </thead>
                            <tbody>
                            <c:forEach items="${productList}" var="product" varStatus="vs">
                                <tr>
                                    <td>
                                        <input id="inputcheck${vs.count}" class="inputcheck" type="checkbox" name="inputcheck" value="${product.id}"/>
                                        <label for="inputcheck${vs.count}"></label>
                                    </td>
                                    <td>${product.id}</td>
                                    <td>
                                    <img  src='${pageContext.request.contextPath}/${product.image}' width="50px" height="50px">
                                    </td>
                                    <td>${product.productName}</td>
                                    <td>${product.discribe}</td>
                                    <td>${product.price}</td>
                                    <td>${product.brand}</td>
                                    <td>${product.type}</td>
                                    <td>
                                        <div class="PublicTableBtnIcon Color3Btn Js_edit" onclick="modifyProduct('${product.id}','${product.image}','${product.productName}','${product.discribe}','${product.price}','${product.brand}','${product.type}')">
                                            <i class="iconfont icon-tubiaozhizuomobanyihuifu-"></i>
                                            <span>修改</span>
                                        </div>
                                        <div class="PublicTableBtnIcon Color4Btn Js_delete" onclick="productDelete('${product.id}')">
                                            <i class="iconfont icon-shanchu"></i>
                                            <span>删除</span>
                                        </div>
                                    </td>
                                </tr>
                            </c:forEach>

                            </tbody>
                        </table>

                    </div>
                    <!--分页-->
                    <div class="PageNumber">
                        <div class="NumbersBox">
                            <ul>
                                ${pageCode}
                            </ul>

                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <!--添加修改产品信息浮层-->
    <div class="PublicFloatBox adduser">
        <div class="kongfx">
            <div class=" wid400">
                <div class="f_Head" id="myModalLabel">
                    <span>添加产品</span>
                    <i class="Js_closeBtn iconfont icon-buoumaotubiao20 fr"></i>
                </div>
                <div class="f_content">
                    <form id="fm" action="${pageContext.request.contextPath}/ProductServlet.action?flag=adminSaveOrUpdate" method="post" enctype="multipart/form-data">

                    <div class="f_alonediv">
                        <div class="f_alone_name">
                            产品名称:
                        </div>
                        <div class="f_alone_input">
                            <input class="f_p_input" id="productName" name="productName"/>
                        </div>
                    </div>
                    <div class="f_alonediv">
                        <div class="f_alone_name">
                            产品描述:
                        </div>
                        <div class="f_alone_input">
                            <input class="f_p_input" id="discribe" name="discribe"/>
                        </div>
                    </div>
                    <div class="f_alonediv">
                        <div class="f_alone_name">
                            产品价格:
                        </div>
                        <div class="f_alone_input">
                            <input class="f_p_input" id="price" name="price"/>
                        </div>
                    </div>
                    <div class="f_alonediv">
                        <div class="f_alone_name">
                            产品品牌:
                        </div>
                        <div class="f_alone_input">
                            <input class="f_p_input" id="brand" name="brand"/>
                        </div>
                    </div>
                    <div class="f_alonediv">
                        <div class="f_alone_name">
                            产品型号:
                        </div>
                        <div class="f_alone_input">
                            <input class="f_p_input" id="type" name="type"/>
                        </div>
                    </div>
                    <div class="f_alonediv">
                        <input id="id" type="hidden" name="id" >
                        <input type="hidden"  id="image" name="image"/>
                        <div class="f_alone_name">
                            产品图片:
                        </div>
                        <div class="f_alone_input">
                            <input class="uploadimg" type="file"  id="newimage" name="newimage"/>

                        </div>
                    </div>
                    </form>
                    <div class="f_alonediv1">
                        <div class="f_alone_name">
                        </div>
                        <div class="f_alone_input1">
                            <!--publicbtn-->
                            <div class="publicf_btn">
                                <div id="butid" class="publicf_btn1" onclick="javascript:saveProduct()">
                                    确定
                                </div>
                                <div class="publicf_btn2 fr Js_closeBtn">
                                    取消
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>